import 'package:chathouse/constant/my_color.dart';
import 'package:chathouse/util/base_utils.dart';
import 'package:flutter/material.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import '../../util/font_utils.dart';
import 'form_widgets.dart';

typedef SelectWidgetItemChange = Function(String? val);

//問題類型5 單選+輸入框(大,多行)
class SingleSelectAndInputWidget5 extends StatefulWidget {
  //單選
  String title;
  String? selectedValue;
  List<KeyValueBean> initValue;
  SelectWidgetItemChange onSelectedItemChange;
  //輸入框
  String? plachoder;
  String? text;
  Function onTextChange;

  bool request;

  SingleSelectAndInputWidget5(this.title, this.selectedValue, this.initValue,
      this.onSelectedItemChange, this.plachoder, this.text, this.onTextChange,
      {this.request = false, Key? key})
      : super(key: key);

  @override
  State<SingleSelectAndInputWidget5> createState() =>
      _SingleSelectAndInputWidget5State();
}

class _SingleSelectAndInputWidget5State
    extends State<SingleSelectAndInputWidget5> {
  TextEditingController textEditingController = TextEditingController();

  @override
  void initState() {
    super.initState();
    textEditingController.text = widget.text ?? "";
  }

  @override
  void dispose() {
    super.dispose();
    textEditingController.dispose();
  }

  @override
  Widget build(BuildContext context) {
    double itemW = (1.sw - 26.w * 2 - 20.w) / 2.0 - 0.1;
    return Container(
        padding: EdgeInsets.only(left: 26.w, right: 26.w),
        child: Column(crossAxisAlignment: CrossAxisAlignment.start, children: [
          Row(crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              widget.request
                  ? Text(
                      "*",
                      style: getTextStyle(18.sp, color: Colors.red),
                    )
                  : Container(),
              Expanded(
                  child: Text(
                widget.title ?? "",
                style: getTextStyle(18.sp, color: Colors.black),
              ))
            ],
          ),
          SizedBox(
            height: 12.w,
          ),
          Wrap(
            spacing: 20.w,
            runSpacing: 20.w,
            children: widget.initValue.map((e) {
              bool isSelected = widget.selectedValue == e.value;
              return Container(
                padding: EdgeInsets.all(6.w),
                constraints:
                    BoxConstraints(minWidth: itemW, maxWidth: itemW * 2 + 20.w),
                decoration: BoxDecoration(
                    color: isSelected ? MyColors.green_204243165 : Colors.white,
                    border:
                        Border.all(width: 1.w, color: MyColors.gary_158157157),
                    borderRadius: BorderRadius.circular(100.w)),
                child: Text(
                  e.name,
                  textAlign: TextAlign.center,
                  style: getTextStyle(16.sp, color: Colors.black),
                ),
              ).setOnClickListener(() {
                setState(() {
                  if (widget.selectedValue == e.value) {
                    widget.selectedValue = null;
                  } else {
                    widget.selectedValue = e.value;
                  }
                });
                if (widget.selectedValue != null) {
                  textEditingController.text = "";
                }
                widget.onSelectedItemChange(widget.selectedValue);
              });
            }).toList(),
          ),
          SizedBox(
            height: 20.w,
          ),
          Container(
            height: 156.w,
            padding: EdgeInsets.symmetric(horizontal: 12.w),
            decoration: BoxDecoration(
              borderRadius: BorderRadius.circular(10.w),
              border: Border.all(color: MyColors.gary_158157157, width: 1.w),
            ),
            child: TextField(
              controller: textEditingController,
              style: getTextStyle(16.sp, color: Colors.black),
              maxLines: 5,
              onChanged: (val) {
                if (textEditingController.text.isNotEmpty) {
                  setState(() {
                    widget.selectedValue = null;
                  });
                }
                widget.onTextChange!(val);
              },
              decoration: InputDecoration(
                hintText: widget.plachoder,
                hintStyle: getTextStyle(16.sp, color: Colors.black),
                border: InputBorder.none,
              ),
            ),
          )
        ]));
  }
}
